<template>
  <view class='main-box'>
      <image
          class="topImg"
          style="height: 510rpx; width: 750rpx"
          model="scaleToFill"
          src="/static/images/bgc_01.png">
      </image>
    <view class="content-box">
      <image style="width: 70px;position: fixed;bottom: 0;right: 10px;" 
        src="/static/images/list.png"  mode="widthFix" @click="toList"/>
      <view class="title-box">
        <view class="title">省退役军人事务厅</view>
        <view class="title">党务政务信息快报</view> 
        <view class="issue ">第{{date}}期</view>
        <view>陕西省退役军人事务厅办公室</view>
        <view>{{createDate}}</view>
        <view class="divider"></view>
        <view class="message">【党务政务信息】</view>
      </view>
      <view class="vocation"> <view class="triangle_border_right"></view>厅领导</view>
         <view class="content" v-for="view in ting" :key="view.id">
            <view class="waterMark">{{userName}}&ensp;{{lookDate}}</view>
            <view class="leader">{{view.leaderName}}同志</view>
            <view v-for="(item,index) in view.contents" :key="item.id">
              {{index+1}}.{{item.content}}。
                 <view v-if="item.file">
               <view v-for="(items,index) in item.file.split(';')" :key='index'>
                   <view  v-if="items.indexOf('jpg') !== -1 || items.indexOf('JPEG') !== -1 || items.indexOf('png') !== -1 || items.indexOf('gif') !== -1">
                        <image
                          mode= "widthFix"
                          :src="items"
                        ></image> 
                    </view> 
                    <view v-if="items.indexOf('mp4') !== -1 ">
                       <video   
                        direction="0"
                        id="myVideo"
                        :src="items"
                      ></video>
                    </view>
               </view>
             </view>
            </view>
         </view>
      <view class="vocation"> <view class="triangle_border_right"></view>处室负责人</view>
          <view class="content" v-for="view in chu" :key="view.id">
            <view class="waterMark">{{userName}}&ensp;{{lookDate}}</view>
            <view class="leader">{{view.leaderName}}同志</view>
            <view v-for="(item,index) in view.contents" :key="item.id">
              {{index+1}}.{{item.content}}。
                 <view v-if="item.file">
               <view v-for="(items,index) in item.file.split(';')" :key='index'>
                   <view  v-if="items.indexOf('jpg') !== -1 || items.indexOf('JPEG') !== -1 || items.indexOf('png') !== -1 || items.indexOf('gif') !== -1">
                        <image
                          mode= "widthFix"
                          :src="items"
                        ></image> 
                    </view> 
                    <view v-if="items.indexOf('mp4') !== -1 ">
                       <video   
                        direction="0"
                        id="myVideo"
                        :src="items"
                      ></video>
                    </view>
               </view>
             </view>
            </view>
         </view>
      <view class="vocation"><view class="triangle_border_right"></view>厅属单位负责人</view>
        <view class="content" v-for="view in dan" :key="view.id">
              <view class="waterMark">{{userName}}&ensp;{{lookDate}}</view>
              <view class="leader">{{view.leaderName}}同志</view>
             <view v-for="(item,index) in view.contents" :key="item.id">
              {{index+1}}.{{item.content}}。
                 <view v-if="item.file">
               <view v-for="(items,index) in item.file.split(';')" :key='index'>
                   <view  v-if="items.indexOf('jpg') !== -1 || items.indexOf('JPEG') !== -1 || items.indexOf('png') !== -1 || items.indexOf('gif') !== -1">
                        <image
                          mode= "widthFix"
                          :src="items"
                        ></image> 
                    </view> 
                    <view v-if="items.indexOf('mp4') !== -1 ">
                       <video   
                        direction="0"
                        id="myVideo"
                        :src="items"
                      ></video>
                    </view>
               </view>
             </view>
            </view>
        
        </view>
       <view v-if="additionalContent.length>0">
         <view style="border-top:2rpx solid #999;margin: 40rpx 0;"></view>
         <view v-for="(view,index) in additionalContent" :key='index'>
              <view class="titleDetail">【{{view.title}}】</view>
              <view class="contentDetail" v-for="(item,indexs) in view.contents " :key="indexs">
                {{item}}
              </view>
         </view>
       </view>   
    </view>   
  </view>
</template>
<script>
import { getPhase,getWriteDetail } from '@/service/services.js'
import moment from 'moment'
  export default {
    data() {
      return{
         createDate:'',
         title:'',
         date:'',
         ting:[],
         chu:[],
         dan:[],
         additionalContent:undefined,
         userName:'',
				 lookDate:moment(new Date()).format('YYYY-MM-DD')
      }
    },
    methods:{
       getDate(){
          getPhase({createDate:this.createDate}).then(res=>{
           this.date=res.data
          })
       },
       getDetail(){
         getWriteDetail({createDate:this.createDate}).then(res=>{
           console.log(res,888779);
           
           if(res.data[3]){
              this.additionalContent=res.data[3].additionalContent
           }
           this.ting= res.data[0].users
           this.chu = res.data[1].users
           this.dan = res.data[2].users
         })
       },
       toList(){
         uni.redirectTo({
               url: '/pagesA/leader-daily/daily-view-detail/daily-list'
         })
       }
    },
    created(){  
    },
    mounted(){
      uni.getStorage({
        key: 'phoneNum',
        success: function (res) {
          console.log('res');
        },
        fail:function(){
          uni.navigateTo({
          url: '/pages/login/index',
        })
        }
     })  
     this.userName=this.$store.state.userInfo.userName 
     this.getDetail()
     this.getDate()
    },
    onLoad(e){
      this.createDate =e.createDate
      this.title =e.title
      wx.setVisualEffectOnCapture({
        visualEffect: 'hidden',
      }) 
    },
    onShareAppMessage(res) {
        return {
        title: this.title,
          path: '/pagesA/leader-daily/daily-view-detail/look-detail?createDate='+this.createDate,
          imageUrl: "/static/images/share_img.jpg",
          success: (res) => {
            console.log("转发成功", res);
          },
          fail: (res) => {
            console.log("转发失败", res);
          }
        }
    }
  }
</script>
<style scoped lang="scss">
   
.main-box {
  width: 100%;
  display: flex;
  flex-direction: column;
  position: absolute;
  background-color: #f5f9ff;
  .title-box{
    margin-top: 50rpx;
    text-align: center;
    view{
      margin:10rpx auto;
    }
    .issue{
     margin: 20rpx 0 40rpx 0;
    }
     .divider{
      border:1rpx solid #FE0000;
      margin: 20rpx 0;
    }
    
  }
  .content-box{
    position: absolute;
    top: 30rpx;
    left: 18rpx;
    width:670rpx;
    min-height: 1000rpx;
    border:1rpx solid #C2C5D4;
    margin: 0px auto;
    padding: 20rpx;
    border-radius: 20rpx;
    background: #fff;
  }
  .title{
    width: 400rpx;
    margin:5rpx auto;
    font-weight: bold;
    color: #FD0002; 
    font-size: 50rpx;
  }
  .vocation{
    font-size: 35rpx;
    font-weight: bold;
  }
  .content{
    padding:0 20rpx;
    view{
      margin: 15rpx 0;
    }
    .leader{
      font-weight: bold;
    }
  }
  .triangle_border_right{
    margin-right:10rpx;
    display: inline-block;
    border-width:20rpx 0 20rpx 20rpx;
    border-style:solid;
    border-color:transparent transparent transparent #FF0200;/*透明 透明 透明 灰*/
    position:relative;
    top:8rpx
  }
  .waterMark{
		color: #E0E0E0;
		transform: rotate(-45deg);
		opacity: 0.5;
		width: 300rpx;
    padding-left: 200rpx;
	}
} 
    .titleDetail{
       text-align: center;
       margin: 45rpx 0 26rpx 0;
       font-size: 35rpx;
    }
    .contentDetail{
      padding: 5rpx 10rpx;
      text-indent: 2em;
      font-size: 30rpx;
    }
         
</style>